<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>PDF</title>
    <link rel="stylesheet" href="../../../css/normalize.css" />
    <style>
      .wrap {
        width: 21cm;
        background-color: #fff;
      }
      .page {
        /*height: 2242px;*/
        /*width: 80%;*/
        margin: auto;
        position: relative;
      }
      .page .content {
        /* width: 95%;
      margin: auto; */
      }
      .page .content .title span {
        padding-left: 25px;
      }
      .content table {
        width: 100%;
        border-collapse: collapse;
      }
      .content .table1 table tr td {
        border: 1px solid #000;
        padding: 10px;
        text-align: center;
        min-width: 80px;
      }
      #pay1,
      #pay2,
      #pay3,
      #pay4 {
        height: 39px;
      }
      .info {
        width: 77px;
      }
      .table1 table tr span:first-child {
        width: 120px;
      }
      .table1 table tr span:last-child {
        width: 320px;
        word-break: break-all;
      }
      .table1 table tr span {
        display: inline-block;
        font-weight: 900;
      }
      .table2,
      .table4,
      .table6 {
        margin: 20px auto;
      }
      .table2 table tr td {
        border: 1px solid #000;
        width: 50%;
        text-align: center;
        font-weight: 900;
        padding: 10px;
      }
      .table3 tr th,
      .table3 tr td {
        padding: 10px;
        border: 1px solid #000;
        text-align: center;
      }
      .table4 h2,
      .table5 h2,
      .table6 h2,
      .table6 p,
      .table7 h2,
      .items h2 {
        margin: 0;
      }
      .table4 tr td {
        padding: 10px;
        border: 1px solid #000;
        text-align: left;
      }
      .table4 tr td span {
        font-weight: 900;
      }
      .table5 div {
        border: 1px solid #000;
        padding: 0 10px;
      }
      .table5 div span {
        font-weight: 900;
      }
      .table7 {
        padding: 30px 0 50px 0;
        overflow: hidden;
      }
      .table7 h2,
      .table7 img {
        float: left;
      }
      .table7 img {
        width: 250px;
        height: 30px;
        border-bottom: 1px solid #000;
      }
    </style>
  </head>
  <body>
    <div class="wrap">
      <img
        style="width: 100px; float: left"
        src="../../../image/logo.png"
        alt=""
      />
      <h1 style="text-align: center; line-height: 100px">
        宏 宇 教 育 学 员 登 记 表
      </h1>
      <!-- <div class="title">
      <span>
        Sample receipt date: [[${sample.receivingDateTime}]]
      </span>
      <br />
      <span>
        PGT reporting date:[[${pgtDate}]]
      </span>
    </div> -->
      <div class="page">
        <div class="content">
          <div class="table1">
            <table>
              <tr>
                <td class="info" rowspan="4">基础信息</td>
                <td>姓名</td>
                <td id="name"></td>
                <td>性别</td>
                <td id="sex"></td>
                <td>出生日期</td>
                <td id="birthday"></td>
                <td>民族</td>
                <td id="nation"></td>
              </tr>
              <tr>
                <td>证件号码</td>
                <td colspan="3" id="idCard"></td>
                <td>住址</td>
                <td colspan="3" id="address"></td>
              </tr>
              <tr>
                <td>联系电话</td>
                <td colspan="3" id="phone"></td>
                <td>工作单位</td>
                <td colspan="3" id="company"></td>
              </tr>
              <tr>
                <td>紧急联系人</td>
                <td colspan="3" id="emergency"></td>
                <td>邮箱</td>
                <td id="email"></td>
                <td>QQ号</td>
                <td id="qq"></td>
              </tr>
              <tr>
                <td class="info">第一学历</td>
                <td>学历层次</td>
                <td id="education1"></td>
                <td>专业</td>
                <td id="discipline1"></td>
                <td>毕业院校</td>
                <td id="school1"></td>
                <td>毕业时间</td>
                <td id="graduation1"></td>
              </tr>
              <tr>
                <td class="info">第二学历</td>
                <td>学历层次</td>
                <td id="education2"></td>
                <td>专业</td>
                <td id="discipline2"></td>
                <td>毕业院校</td>
                <td id="school2"></td>
                <td>毕业时间</td>
                <td id="graduation2"></td>
              </tr>
              <tr>
                <td class="info" rowspan="2">报考信息</td>
                <td>报考类型</td>
                <td id="type">学历</td>
                <td>学历层次</td>
                <td id="items"></td>
                <td>学校</td>
                <td id="subject" colspan="3"></td>
              </tr>
              <tr>
                <td>学习形式</td>
                <td id="batch"></td>
                <td>批次</td>
                <td id="assist"></td>
                <td>专业</td>
                <td colspan="3" id="classTime"></td>
              </tr>
              <tr>
                <td class="info" rowspan="7">缴费信息</td>
                <td>缴费期数</td>
                <td colspan="3">缴费金额</td>
                <td colspan="3">缴费日期</td>
                <td>是否缴费</td>
              </tr>
              <tr id="pay1">
                <td></td>
                <td colspan="3"></td>
                <td colspan="3"></td>
                <td></td>
              </tr>
              <tr id="pay2">
                <td></td>
                <td colspan="3"></td>
                <td colspan="3"></td>
                <td></td>
              </tr>
              <tr id="pay3">
                <td></td>
                <td colspan="3"></td>
                <td colspan="3"></td>
                <td></td>
              </tr>
              <tr id="pay4">
                <td></td>
                <td colspan="3"></td>
                <td colspan="3"></td>
                <td></td>
              </tr>
              <tr>
                <td>总费用</td>
                <td colspan="2" id="total"></td>
                <td>优惠费用</td>
                <td colspan="2" id="discount"></td>
                <td>已缴费用</td>
                <td id="paid"></td>
              </tr>
              <tr>
                <td style="text-align: left" colspan="8">
                  如果您选择了分期缴费，分期费用请按照约定的时间按时缴纳。
                </td>
              </tr>
              <tr>
                <td class="info">确认并承诺</td>
                <td style="text-align: left" colspan="8">
                  1、本人对本表所填写内容及所附证明材料的真实性负完全责任。<br />
                  2、本人确认：报名前，已通过登录“中国高等教育学生信息网”（http://www.chsi.com.cn）查询，或通过其它有效渠道得知我用于报名的学历毕业证书属于国民教育系列，任何时候由于学历毕业证书不属于国民教育系列而产生的任何后果，自行承担全部责任，所发生费用不予退还。<br />
                  3、本人承诺：按时足额交纳费用，因拖欠费用而产生的任何后果由本人承担。<br />
                  4、因特殊情况无法获得相关证书，本人只要求退还所缴费用，自愿放弃其它一切主张和权利。<br />
                  5、因个人原因未能按时参加宏宇教育组织的培训课程，所缴费用不予退还，自愿放弃其它一切主张和权利。<br />
                  6、本人对以上“确认与承诺”的内容已经阅读并充分理解其含义。
                </td>
              </tr>
            </table>
            <div style="display: flex; padding: 20px 50px 0 50px">
              <span style="flex: 3">学生签名:</span>
              <span style="flex: 3">招生老师:</span>
              <span style="flex: 3">负责人:</span>
            </div>
            <div style="display: flex; padding: 25px 50px">
              <span style="flex: 3">日期:</span>
              <span style="flex: 3">日期:</span>
              <span style="flex: 3">日期:</span>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script src="../../../js/jquery.js"></script>
    <script src="../../../js/common.js"></script>
    <script>
      function getUserInfo(idNo, trainType, studyId) {
        $.ajax({
          url: baseUrl + "studentInfo/getStudentInfo",
          method: "get",
          headers: {
            Authorization: JSON.parse(localStorage.getItem("userInfo")).token,
          },
          data: {
            idNo,
            trainType,
            studyId,
          },
          success: function (data) {
            const { student, fees, studentEducation } = data;
            $("#name").text(student.name);
            $("#sex").text(student.sex);
            $("#birthday").text(student.birthday);
            $("#nation").text(student.nation);
            $("#idCard").text(student.idNo);
            $("#address").text(student.address);
            $("#phone").text(student.phoneNum);
            $("#company").text(student.workAdress);
            // 紧急联系人
            $("#emergency").text("");
            $("#email").text(student.email);
            $("#qq").text(student.qqNumber);
            $("#education1").text(student.educationName);
            $("#education2").text(student.educationName2);
            $("#discipline1").text(student.major);
            $("#discipline2").text(student.major2);
            $("#school1").text(student.graduateSchool);
            $("#school2").text(student.graduateSchool2);
            $("#graduation1").text(student.graduateTime);
            $("#graduation2").text(student.graduateTime2);
            $("#items").text(studentEducation.educationName);
            $("#subject").text(studentEducation.schoolName);
            $("#batch").text(studentEducation.studyMode);
            $("#assist").text(studentEducation.batch);
            $("#classTime").text(studentEducation.majorName);
            fees.map((item, index) => {
              $(`#pay${index + 1} td`)
                .eq(0)
                .text(item.stage);
              $(`#pay${index + 1} td`)
                .eq(1)
                .text(item.amount);
              $(`#pay${index + 1} td`)
                .eq(2)
                .text(item.term);
              $(`#pay${index + 1} td`)
                .eq(3)
                .text(item.flag === 1 ? "是" : "否");
              $(`#total`).text(item.allFee);
              $(`#discount`).text(item.preferentialFee);
              $(`#paid`).text(item.realPayFee);
            });
          },
        });
      }

      function getQuery(variable) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
          var pair = vars[i].split("=");
          if (pair[0] == variable) {
            return pair[1];
          }
        }
        return false;
      }

      if (getQuery("from")) {
        var trainType = getQuery("trainType");
        var idNo = getQuery("idNo");
        var studyId = getQuery("studyId");
        getUserInfo(idNo, trainType, studyId);
      }
    </script>
  </body>
</html>
